Vue.component('goods-list-component', {
  props: ['orderitems'],
  template: `
  <div class="list">
  <ul  v-for="(item,index) in orderitems" :key="item.id">
    <li>
      <img
        class="goods-cover"
        :src="item.image"
        alt=""
      />
    </li>
    <li class="goods-title">
      <h2>{{ item.title }}</h2>
    </li>
    <li class="godds-status">
         <span class="send" :class="{unSend: item.status === '0', sended: item.status === '1', end: item.status === '2'}" v-if="item.status === '0'">未发货</span>
         <span class="send" :class="{unSend: item.status === '0', sended: item.status === '1', end: item.status === '2'}" v-else-if="item.status === '1'">已发货</span>
         <span class="send" :class="{unSend: item.status === '0', sended: item.status === '1', end: item.status === '2'}" v-else-if="item.status === '2'">已完成</span>
    </li>
    <li class="goods-info">
      <p>
        {{ item.description }}
      </p>
    </li>
  </ul>
</div>
    `,
})
